<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="utf-8">
        <title>Layui</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
        <link rel="stylesheet" href="../../../layuiadmin/style/admin.css" media="all">
        <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    </head>
    <body>
        <form class="layui-form" action="">
            <div class="layui-inline">
                <label class="layui-form-label">选择角色：</label>
                <div class="layui-input-inline">
                    <select name="role" lay-verify="required" lay-search="">
                        <option value="0">--请选择角色--</option>
                        <option th:each="role:${roles}" th:value="${role.id}" th:text="${role.nameZH}"></option>
                    </select>
                </div>
            </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">用户角色</label>
                <div class="layui-input-block">
                    <input th:each="menu:${menus}" type="checkbox" name="menus" th:value="${menu.id}"
                           th:title="${menu.getName()}">
                </div>
            </div>

            <div class="layui-form-item layui-hide">
                <input type="button" lay-submit="" lay-filter="demo1" id="LAY-user-front-submit" value="确认">
            </div>

        </form>
        <script src="../../../layuiadmin/layui/layui.js" charset="utf-8"></script>
        <!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
        <script>
            layui.config({
                base: '../../../layuiadmin/' //静态资源所在路径
            }).extend({
                index: 'lib/index' //主入口模块
            }).use(['form', 'layedit', 'laydate'], function () {
                var $=layui.$,
                    form = layui.form
                    , layer = layui.layer
                ;


                //监听提交
                form.on('submit(demo1)', function (data) {
                    var test=$("input[type='checkbox']:checked");
                    var menus='';
                    test.each(function () {
                            menus+=$(this).val()+","
                    })
                    $.ajax({
                        url: '/updateMenu',
                        type: "post",
                        dataType: "json",
                        data: {
                            role: data.field.role,
                            menus:menus
                        },
                        success: function (msg) {
                            var code = msg.code;
                            if (code == 200) {
                                layer.closeAll('loading');
                                layer.load(2);
                                layer.msg("添加成功", {icon: 6});
                                setTimeout(function () {
                                    window.parent.location.reload();
                                }, 1000);
                            }
                        }
                    });
                    return false;
                });

            });
        </script>